<template>
  <div class="container">
    <el-dialog title="行采订单修改" :visible.sync="detailsDialog.centerDialogVisible" @open="getPackageBox" @close="cancel"
      center width="99%">
      <el-table :data="tableData" :summary-method="getSummaries" show-summary border max-height="500" style="width: 100%"
        empty-text="暂无数据">
        <el-table-column prop="goods_name" label="商品名称" align="center"></el-table-column>
        <el-table-column prop="erp_goods_code" label="商品编码" align="center"></el-table-column>
        <el-table-column prop="goods_spec" label="规格" align="center"></el-table-column>
        <el-table-column prop="category_code" label="分类编码" align="center"></el-table-column>
        <el-table-column prop="category_name" label="分类名称" align="center"></el-table-column>
        <el-table-column prop="goods_unit" label="单位" align="center"></el-table-column>
        <el-table-column prop="bar_code" label="条形码" align="center"></el-table-column>
        <el-table-column prop="purchasePrice" label="采购加价" align="center"></el-table-column>
        <el-table-column prop="stockRemoval" label="出库价" align="center"></el-table-column>
        <el-table-column prop="totalPrices" label="出库价总价" align="center"></el-table-column>
        <el-table-column prop="reference_price" label="入库参考价" align="center"></el-table-column>
        <el-table-column prop="costPrices" label="成本总价" align="center"></el-table-column>
        <el-table-column label="成本价" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number size="small" @change="markup(scope)" :controls="false"
              v-model="scope.row.cost_price"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="数量" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number size="small" @change="orderNum(scope)" :controls="false"
              v-model="scope.row.order_num"></el-input-number>
          </template>
        </el-table-column>

        <el-table-column label="加价" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number size="small" @change="markup(scope)" :controls="false"
              v-model="scope.row.markup"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column prop="box_qty" label="件数" align="center" width="150px">
        </el-table-column>
        <el-table-column label="预提" align="center" width="150px">
          <template>
            <!-- <div>{{ scope.row.withholding_fee }}</div> -->
            <div>0.0000</div>
          </template>
        </el-table-column>
        <el-table-column prop="rk_spec" width="150px" label="入库规格" align="center">
        </el-table-column>
        <el-table-column label="生产日期" align="center" width="250px">
          <template slot-scope="scope">
            <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-model="scope.row.produce_date" type="datetime"
              placeholder="选择日期时间">
            </el-date-picker>
          </template>
        </el-table-column>
        <el-table-column label="保质期（天）" align="center" width="150px">
          <template slot-scope="scope">
            <el-input-number size="small" :controls="false" v-model="scope.row.shelf_life"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="到期日" align="center" width="250px">
          <template slot-scope="scope">
            <el-date-picker value-format="yyyy-MM-dd HH:mm:ss" v-model="scope.row.due_date" type="datetime"
              placeholder="选择日期时间">
            </el-date-picker>
          </template>
        </el-table-column>
        <el-table-column label="包装箱" align="center" width="150px">
          <template slot-scope="scope">
            <el-select v-model="scope.row.package_box_id" @change="rdcBox(scope)" placeholder="请选择">
              <el-option v-for="item in boxList" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column label="包装箱规格" align="center" width="200px">
          <template slot-scope="scope">
            <div>
              <el-input-number size="small" :precision="4" v-if="scope.row.rdcType" :controls="false"
                v-model="scope.row.package_box_specInp"></el-input-number>
              <span v-else>{{ scope.row.package_box_specInp }}</span>
              <span v-if="scope.row.rdcType" style="line-height: 30px;margin-left: 5px;">KG</span>
              <span v-else style="line-height: 30px;margin-left: 5px;">个</span>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="备注" align="center" width="250px">
          <template slot-scope="scope">
            <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="scope.row.notes">
            </el-input>
          </template>
        </el-table-column>
        <!-- <el-table-column label="操作" align="center" width="150px">
          <template slot-scope="scope"> -->
        <!-- <el-button
              size="mini"
              type="danger"
              @click="remove(scope)"
              icon="el-icon-delete"
              >删除</el-button
            > -->
        <!-- <el-button
              size="mini"
              type="primary"
              class="handleSearch"
              icon="el-icon-circle-plus"
              @click="addSpec(scope)"
              >添加规格</el-button
            > -->
        <!-- </template>
        </el-table-column> -->
      </el-table>
      <!-- <el-dialog
        width="400px"
        title="添加规格"
        center
        :visible.sync="spaceDialog"
        append-to-body
        @close="cancelSpec"
      >
        <el-form label-width="100px" label-position="center">
          <el-form-item label="规格：">
            <el-input-number
              size="small"
              :controls="false"
              v-model="spec"
            ></el-input-number>
          </el-form-item>
        </el-form>

        <span slot="footer" class="dialog-footer">
          <el-button @click="cancelSpec">取 消</el-button>
          <el-button type="primary" @click="specNum()">确 定</el-button>
        </span>
      </el-dialog> -->
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import {
  findOrderInfo,
  editHangCaiOrderInfo,
  getPackageBoxData
} from "@/api/superOrder/superOrderList";
import { getToken } from "@/utils/auth";
import { Loading } from "element-ui";
export default {
  props: {
    detailsDialog: Object,
  },
  data() {
    return {
      tableData: [],
      boxData: {},
      boxList: [],
      rdc: null,
      //   spaceDialog: false,
      //   spec: "0",
      //   specId: "",
    };
  },
  methods: {
    //取消
    cancel() {
      this.detailsDialog.centerDialogVisible = false;
      this.tableData = [];
    },
    getPackageBox() {
      getPackageBoxData().then(res => {
        this.boxData = res.data.package;
        this.rdc = res.data.rdc
        this.getData();
      })
    },
    rdcBox(scope) {
      let id = scope.row.package_box_id;
      this.boxList.forEach((res, index) => {
        if (res.id == scope.row.package_box_id) {
          if (index == 0) {
            scope.row.rdcType = false;
            scope.row.package_box_specInp = 1
          } else {
            scope.row.rdcType = true
            scope.row.package_box_specInp = scope.row.package_box_spec
          }
        }
      })
      console.log(scope.row.package_box_id, 9999)
    },
    getData() {
      let data = {
        id: this.detailsDialog.id,
      };
      findOrderInfo(data).then((res) => {
        if (res.code == 0) {
          if (res.data.info.rdc_attr == '0') {
            this.boxList = this.boxData.shengnei;
          } else {
            this.boxList = this.boxData.shengwai

          }
          let rdcBool = null;
          res.data.info.order_goods.forEach((result) => {
            this.boxList.forEach((prop, index) => {
              if (prop.id == result.package_box_id) {
                if (index == 0) {
                  rdcBool = false
                } else {
                  rdcBool = true
                }
              }
            })
            result.rdcType = rdcBool;
            result.package_box_specInp = result.package_box_spec;
            result.costPrices =
              parseFloat(result.cost_price) * parseFloat(result.order_num);
            result.isXcMsg = result.is_zc == 1 ? "中仓商品" : "供应商商品";

            result.purchasePrice = result.buyerprofit_price;
            if (result.is_zc == 1) {
              result.stockRemoval = (
                parseFloat(result.cost_price) +
                parseFloat(result.markup) +
                parseFloat(result.purchasePrice)
              )
                // +parseFloat(result.withholding_fee)
                .toFixed(4);
              result.totalPrices = (
                result.stockRemoval * result.order_num
              ).toFixed(4);
            } else {
              result.stockRemoval = (
                parseFloat(result.cost_price) +
                parseFloat(result.markup) +
                parseFloat(result.purchasePrice)
              )
                // +parseFloat(result.withholding_fee)
                .toFixed(4);
              result.totalPrices = (
                result.stockRemoval * result.order_num
              ).toFixed(4);
            }
          });
          this.tableData = res.data.info.order_goods;
          this.type = res.data.info.type;
        }
      });
    },
    //修改加价率和预提
    markup(scope) {
      let cost_price = scope.row.cost_price ? scope.row.cost_price : 0;
      let markup = scope.row.markup ? scope.row.markup : 0;
      let order_num = scope.row.order_num ? scope.row.order_num : 0;
      scope.row.costPrices = parseFloat(cost_price) * parseFloat(order_num);
      let purchasePriceCenter = (
        (parseFloat(cost_price) + parseFloat(markup)) *
        parseFloat(scope.row.buyerprofitrate)
      ).toFixed(4);
      scope.row.purchasePrice = scope.row.buyerprofitmode
        ? scope.row.buyerprofitrate
        : purchasePriceCenter;
      scope.row.stockRemoval = (
        parseFloat(cost_price) +
        parseFloat(markup) +
        parseFloat(scope.row.purchasePrice)
      ).toFixed(4);
      scope.row.totalPrices = (scope.row.stockRemoval * order_num).toFixed(4);

      this.$set(this.tableData, scope.$index, scope.row);
    },
    //修改数量
    orderNum(scope) {
      let order_num = scope.row.order_num ? scope.row.order_num : 0;
      scope.row.costPrices =
        parseFloat(scope.row.cost_price) * parseFloat(order_num);
      scope.row.totalPrices = (
        parseFloat(scope.row.stockRemoval) * parseFloat(order_num)
      ).toFixed(4);
      scope.row.box_qty = (
        parseFloat(order_num) / parseFloat(scope.row.rk_spec)
      ).toFixed(4);
      this.$set(this.tableData, scope.$index, scope.row);
    },
    //删除
    remove(scope) {
      let id = scope.row.erp_goods_code;
      this.tableData.forEach((res, index) => {
        if (res.erp_goods_code == id) {
          this.tableData.splice(index, 1);
        }
      });
      this.priceNum = 0;
    },

    //添加规格
    // addSpec(scope) {
    //   this.specId = scope.row.BarCode;
    //   this.spaceDialog = true;
    // },
    // cancelSpec() {
    //   this.spaceDialog = false;
    //   this.spec = 0;
    //   this.specId = "";
    // },
    //规格确定
    // specNum() {
    //   this.tableData.forEach((res, index) => {
    //     if (res.BarCode == this.specId) {
    //       res.SonCountsList.push({
    //         value: this.spec,
    //         label: this.spec,
    //       });
    //       this.$set(this.tableData, index, res);
    //       this.cancelSpec();
    //     }
    //   });
    // },
    //总价
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "总价";
          return;
        }
        const values = data.map((item) => Number(item[column.property]));
        if (!values.every((value) => isNaN(value))) {
          sums[index] = values.reduce((prev, curr) => {
            const value = Number(curr);
            if (!isNaN(value)) {
              return prev + curr;
            } else {
              return prev;
            }
          }, 0);
          if (index != 10) {
            sums[index] = "";
          } else {
            sums[index] = sums[index].toFixed(4);
          }
        } else {
          sums[index] = "";
        }
      });

      return sums;
    },
    sonCount(scope) {
      if (scope.row.order_num) {
        scope.row.box_qty = (
          parseFloat(scope.row.order_num) / parseFloat(scope.row.rk_spec)
        ).toFixed(4);
        this.$set(this.tableData, scope.$index, scope.row);
      }
    },
    //确定
    confirm() {
      let arr = [];
      this.tableData.forEach((res) => {
        arr.push({
          id: res.id,
          erp_goods_code: res.erp_goods_code,
          goods_name: res.goods_name,
          bar_code: res.bar_code,
          goods_unit: res.goods_unit,
          goods_spec: res.goods_spec || "",
          category_code: res.category_code,
          category_name: res.category_name,
          is_zc: 1,
          cost_price: res.cost_price,
          order_num: res.order_num,
          box_qty: res.box_qty,
          // withholding_fee: res.withholding_fee,
          withholding_fee: 0.0,
          markup: res.markup,
          produce_date: res.produce_date,
          shelf_life: res.shelf_life,
          rk_spec: res.rk_spec,
          due_date: res.due_date,
          buyerprofitmode: res.buyerprofitmode,
          buyerprofitrate: res.buyerprofitrate,
          package_box_id: res.package_box_id,
          package_box_spec: res.package_box_specInp,
          notes: res.notes
        });
      });
      let data = {
        goods: JSON.stringify(arr),
        id: this.detailsDialog.id,
      };
      console.log(data, arr, 999);
      editHangCaiOrderInfo(data).then((res) => {
        if (res.code == 0) {
          this.$message({
            type: "success",
            message: res.msg || res.message,
          });
          this.$emit("upData");
          this.cancel();
        }
      });
    },
  },
};
</script>
<style scoped>
.pagination {
  text-align: right;
  padding: 10px;
}

.top {
  margin-bottom: 5px;
}
</style>
